<template>
  <a-spin :spinning="confirmLoading">
    <j-form-container :disabled="formDisabled">
      <a-form-model ref="form" :model="model" :rules="validatorRules" slot="detail">
        <a-row>
          <a-col :span="24">
            <a-form-model-item label="组ID" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="groupId">
              <a-input-number v-model="model.groupId" placeholder="请输入组ID" style="width: 100%" />
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="组名称" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="groupName">
              <a-input v-model="model.groupName" placeholder="请输入组名称"  ></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="组类型" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="groupType">
              <a-input v-model="model.groupType" placeholder="请输入组类型"  ></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="组背景图片url" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="groupBackgroundUrl">
              <a-input v-model="model.groupBackgroundUrl" placeholder="请输入组背景图片url"  ></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="内容类型" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="contentType">
              <a-input v-model="model.contentType" placeholder="请输入内容类型"  ></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="文本内容" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="content">
              <a-textarea v-model="model.content" rows="4" placeholder="请输入文本内容" />
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="发布者用户ID" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="ownerUserId">
              <a-input-number v-model="model.ownerUserId" placeholder="请输入发布者用户ID" style="width: 100%" />
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="发布者姓名" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="ownerName">
              <a-input v-model="model.ownerName" placeholder="请输入发布者姓名"  ></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="发布者别名" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="ownerAlias">
              <a-input v-model="model.ownerAlias" placeholder="请输入发布者别名"  ></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="发布者头像URL" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="ownerAvatarUrl">
              <a-input v-model="model.ownerAvatarUrl" placeholder="请输入发布者头像URL"  ></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="发布者所在地" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="ownerLocation">
              <a-input v-model="model.ownerLocation" placeholder="请输入发布者所在地"  ></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="最新点赞用户信息" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="latestLikes">
              <a-input v-model="model.latestLikes" placeholder="请输入最新点赞用户信息"  ></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="点赞数" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="likesCount">
              <a-input-number v-model="model.likesCount" placeholder="请输入点赞数" style="width: 100%" />
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="赞赏数" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="rewardsCount">
              <a-input-number v-model="model.rewardsCount" placeholder="请输入赞赏数" style="width: 100%" />
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="评论数" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="commentsCount">
              <a-input-number v-model="model.commentsCount" placeholder="请输入评论数" style="width: 100%" />
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="是否加精" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="contentDigested">
              <a-input-number v-model="model.contentDigested" placeholder="请输入是否加精" style="width: 100%" />
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="是否置顶" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="sticky">
              <a-input-number v-model="model.sticky" placeholder="请输入是否置顶" style="width: 100%" />
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="内容发布时间" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="contentCreateTime">
              <j-date placeholder="请选择内容发布时间" v-model="model.contentCreateTime"  style="width: 100%" />
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="内容修改时间" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="contentModifyTime">
              <j-date placeholder="请选择内容修改时间" v-model="model.contentModifyTime"  style="width: 100%" />
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="当前用户是否点赞" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="userSpecificLiked">
              <a-input v-model="model.userSpecificLiked" placeholder="请输入当前用户是否点赞"  ></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="是否加精" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="digested">
              <a-input-number v-model="model.digested" placeholder="请输入是否加精" style="width: 100%" />
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="用户ID" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="uid">
              <a-input v-model="model.uid" placeholder="请输入用户ID"  ></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="对象ID" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="objectid">
              <a-input v-model="model.objectid" placeholder="请输入对象ID"  ></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="对象类型" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="classname">
              <a-input v-model="model.classname" placeholder="请输入对象类型"  ></a-input>
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="标签" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="hashtags">
              <a-input v-model="model.hashtags" placeholder="请输入标签"  ></a-input>
            </a-form-model-item>
          </a-col>
        </a-row>
      </a-form-model>
    </j-form-container>
  </a-spin>
</template>

<script>

  import { httpAction, getAction } from '@/api/manage'
  import { validateDuplicateValue } from '@/utils/util'

  export default {
    name: 'TopicQueryArticleForm',
    components: {
    },
    props: {
      //表单禁用
      disabled: {
        type: Boolean,
        default: false,
        required: false
      }
    },
    data () {
      return {
        model:{
         },
        labelCol: {
          xs: { span: 24 },
          sm: { span: 5 },
        },
        wrapperCol: {
          xs: { span: 24 },
          sm: { span: 16 },
        },
        confirmLoading: false,
        validatorRules: {
           groupId: [
              { required: true, message: '请输入组ID!'},
           ],
           groupName: [
              { required: true, message: '请输入组名称!'},
           ],
           groupType: [
              { required: true, message: '请输入组类型!'},
           ],
           groupBackgroundUrl: [
              { required: true, message: '请输入组背景图片url!'},
           ],
           contentType: [
              { required: true, message: '请输入内容类型!'},
           ],
           content: [
              { required: true, message: '请输入文本内容!'},
           ],
           ownerUserId: [
              { required: true, message: '请输入发布者用户ID!'},
           ],
           ownerName: [
              { required: true, message: '请输入发布者姓名!'},
           ],
           ownerAlias: [
              { required: true, message: '请输入发布者别名!'},
           ],
           ownerAvatarUrl: [
              { required: true, message: '请输入发布者头像URL!'},
           ],
           ownerLocation: [
              { required: true, message: '请输入发布者所在地!'},
           ],
           latestLikes: [
              { required: true, message: '请输入最新点赞用户信息!'},
           ],
           likesCount: [
              { required: true, message: '请输入点赞数!'},
           ],
           rewardsCount: [
              { required: true, message: '请输入赞赏数!'},
           ],
           commentsCount: [
              { required: true, message: '请输入评论数!'},
           ],
           contentDigested: [
              { required: true, message: '请输入是否加精!'},
           ],
           sticky: [
              { required: true, message: '请输入是否置顶!'},
           ],
           contentCreateTime: [
              { required: true, message: '请输入内容发布时间!'},
           ],
           contentModifyTime: [
              { required: true, message: '请输入内容修改时间!'},
           ],
           userSpecificLiked: [
              { required: true, message: '请输入当前用户是否点赞!'},
           ],
           digested: [
              { required: true, message: '请输入是否加精!'},
           ],
           uid: [
              { required: true, message: '请输入用户ID!'},
           ],
           objectid: [
              { required: true, message: '请输入对象ID!'},
           ],
           classname: [
              { required: true, message: '请输入对象类型!'},
           ],
           hashtags: [
              { required: true, message: '请输入标签!'},
           ],
        },
        url: {
          add: "/topicqueryarticle/topicQueryArticle/add",
          edit: "/topicqueryarticle/topicQueryArticle/edit",
          queryById: "/topicqueryarticle/topicQueryArticle/queryById"
        }
      }
    },
    computed: {
      formDisabled(){
        return this.disabled
      },
    },
    created () {
       //备份model原始值
      this.modelDefault = JSON.parse(JSON.stringify(this.model));
    },
    methods: {
      add () {
        this.edit(this.modelDefault);
      },
      edit (record) {
        this.model = Object.assign({}, record);
        this.visible = true;
      },
      submitForm () {
        const that = this;
        // 触发表单验证
        this.$refs.form.validate(valid => {
          if (valid) {
            that.confirmLoading = true;
            let httpurl = '';
            let method = '';
            if(!this.model.id){
              httpurl+=this.url.add;
              method = 'post';
            }else{
              httpurl+=this.url.edit;
               method = 'put';
            }
            httpAction(httpurl,this.model,method).then((res)=>{
              if(res.success){
                that.$message.success(res.message);
                that.$emit('ok');
              }else{
                that.$message.warning(res.message);
              }
            }).finally(() => {
              that.confirmLoading = false;
            })
          }
         
        })
      },
    }
  }
</script>